<!-- 编辑弹窗 -->
<template>
  <ele-modal width="40%" :visible="visible" :close-on-click-modal="true" custom-class="ele-dialog-form"
    :title="isUpdate ? '修改满减优惠信息' : '添加满减优惠信息'" @update:visible="updateVisible" >
    <el-form ref="form" :model="form" :rules="rules" label-width="100px" >
      <el-row :gutter="24">
        <el-col :md="24" :sm="24">
          <el-form-item label="满:"  prop="fullPrice">
            <el-input clearable v-model="form.fullPrice" placeholder="请输入满减金额"  @keyup.native="form.fullPrice = form.fullPrice.replace(/[^\d.]/g,'');
                        form.fullPrice = form.fullPrice.replace(/\.{2,}/g,'.');
                        form.fullPrice = form.fullPrice.replace(/^\./g,'');
                        form.fullPrice = form.fullPrice.replace('.','$#$').replace(/\./g,'').replace('$#$','.');
                        form.fullPrice = form.fullPrice.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3');"/>
          </el-form-item>
        </el-col>
        <el-col :md="24" :sm="24">
          <el-form-item label="减:"  prop="reduce">
            <el-input clearable v-model="form.reduce" placeholder="请输入满减优惠"   @keyup.native="form.reduce = form.reduce.replace(/[^\d.]/g,'');
                        form.reduce = form.reduce.replace(/\.{2,}/g,'.');
                        form.reduce = form.reduce.replace(/^\./g,'');
                        form.reduce = form.reduce.replace('.','$#$').replace(/\./g,'').replace('$#$','.');
                        form.reduce = form.reduce.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3');"/>
          </el-form-item>
        </el-col>
        <el-col :md="24" :sm="24">
          <el-form-item label="备注:">
            <el-input :rows="4" type="textarea" :maxlength="200" v-model="form.remark" placeholder="请输入备注" />
          </el-form-item>
        </el-col>
      </el-row>
  </el-form>
  <div slot="footer">
    <el-button @click="updateVisible(false)">取消</el-button>
    <el-button type="primary" :loading="loading" v-if="this.btnindex!='3'" @click="save">
      保存
    </el-button>
  </div>
  </ele-modal>
</template>

<script>
  import moment from "moment";
  import upload from "@/components/UpLoad/index.js";
  import { AddFulldiscount, QueryFulldiscountById, UpdateFulldiscount } from '@/api/salesmanager/fullreduce';

  export default {
    name: 'FullEdit',
    mixins: [upload],
    props: {
      // 弹窗是否打开
      visible: Boolean,
      // 修改回显的数据
      data: Object,
      //按钮索引
      btnindex:String,
    },
    data() {
      return {
        // 表单数据
        form: {},
        // 表单验证规则
        rules: {
          fullPrice: [{required: true,message: '请输入满减金额',trigger: 'blur'}],
          reduce: [{required: true,message: '请输入满减优惠',trigger: 'blur'}],
        },
        // 提交状态
        loading: false,
        // 是否是修改
        isUpdate: false,
      };
    },

    //初始化数据
    mounted(){
      
    },
    methods: {
     
      /* 保存编辑 */
      save() {
        //校验必填信息
        this.$refs['form'].validate((valid) => {
          if (!valid) {return false;}

          this.loading = true;
          this.form.status = 0;
          this.form.deleted = 0;
          const saveOrUpdate = this.isUpdate ? UpdateFulldiscount : AddFulldiscount;
          saveOrUpdate(this.form)
            .then((msg) => {
              this.loading = false;
              this.$message.success(msg);
              this.updateVisible(false);

              //回调父组件方法
              this.$emit('done');
            })
            .catch((e) => {
              this.loading = false;
              this.$message.error(e.message);
            });
        });
      },

      /* 更新visible */
      updateVisible(value) {
        //更新父组件中的visible的值
        this.$emit('update:visible', value);
      },

      //赋值到页面
      setFulldiscount(id){
        QueryFulldiscountById(id)
            .then((res) => {
            this.form = res;
        });
      },
    },

    /* 监听visible属性变化 */
    watch: {
      visible(visible) {
        if (visible) {
          if (this.data && this.data.id){
            //初始化form
            this.form = {};
            this.setFulldiscount(this.data.id);
            this.isUpdate = this.data.id !=null && this.data.id !=undefined;
          } else {
            this.form = {};
            this.isUpdate =false;
          }
        } else {
          //移除校验结果
            this.$refs['form'].clearValidate();
        }
      },
    }
  };
</script>
